<template>
    <div class='checkout_list'>
        <el-table v-if="!shows"
            :data="glJson"
            stripe
            border
            show-summary
            :summary-method="getSummaries"
            >
            <el-table-column
            prop="szi_ex1"
            :label="glName"
            width="240">
            </el-table-column>
            <el-table-column
            prop="num"
            label="数量"
            width="60"  v-if="sCode!='lygrwy'">
            </el-table-column>
            <el-table-column
            prop="amt_total"
            width="240"
            label="金额">
            </el-table-column>
             <el-table-column
                prop="amt_yh"
                v-if="isYh=='Y'"
                label="优惠">
                </el-table-column>
                <el-table-column
                
                prop="amt_sh"
                v-if="isYh=='Y'"
                label="实收">
                
                </el-table-column>
        </el-table>
        <el-row v-if="shows">
             
            <el-col :span="12"  >
                <el-table
                    :data="glJson"
                    stripe
                    border
                    show-summary
                    :summary-method="getSummaries"
                    style="width: 100%;margin-left:5px;"
                    >
                    <el-table-column
                    prop="szi_ex1"
                    :label="glName"
                    width="140">
                    </el-table-column>
                    <el-table-column
                    prop="num"
                    label="数量"
                    width="60"  v-if="sCode!='lygrwy'">
                    </el-table-column>
                    <el-table-column
                    prop="amt_total"
                    label="金额">
                    </el-table-column>
                    
                </el-table>
            </el-col>
            <el-col :span="12"   v-if="shows">
                <el-table
                    :data="gsJson"
                    stripe
                    border
                    show-summary
                  
                    :summary-method="getSummaries"
                    style="width: 100%;"
                    >
                    <el-table-column
                    prop="szi_ex1"
                    :label="gsName" 
                    width="140">
                    </el-table-column>
                    <el-table-column
                    prop="num"
                    label="数量"
                    width="60" v-if="sCode!='lygrwy'">
                    </el-table-column>
                    <el-table-column
                    prop="amt_total"
                    label="金额">
                    </el-table-column>
                    
                </el-table>
            </el-col>
        </el-row>
    </div>
</template>
<script>
export default {
    name:'gm_check_out_list',
    props:['data','exkey'],
    components: {
    },
    data(){
        return{
            glJson:[],
            jz_id:'',
            c_id:'',
            shows:true,
            gsName:this.exkey.gsName,
            glName:this.exkey.glName,
            sCode:localStorage.getItem("sCode"),
            isYh:this.exkey.isYh,
        }
    },
    created(){
        let sef=this;
        this.loadData();
        this.glJson=this.data.gl;
        this.gsJson=this.data.gs;
        console.log(this.glJson,"this.glJson------------------------")
        console.log(this.gsJson,"this.gsJson------------------------")
        console.log("jzItem--------------------------------------------------------");
        console.log(this.data)
        if(!this.glName){
            this.glName="项目名称"
        }
        if(this.exkey.type=='simple'){
            this.shows=false;
        }
       // alert(this.exkey.type);
        window.addEventListener('message', function(messageEvent) {
            var data = messageEvent.data;
            let datas=JSON.stringify(data)
            if(datas.jz_id){
                this.jz_id=datas.jz_id;
            }
        // vue.menuTitle = data;
        },false);
        
    },
    methods:{
        getSummaries(param){
             const { columns, data } = param;
            console.log(param)
            //console.log(data)
            const sums = [];
            columns.forEach((column, index) => {
            //console.log(column)
            //console.log(index)
            if (index === 0) {
                sums[index] = '合计';
                return;
            }
            const values = data.map(item => Number(item[column.property]));
            //验证每个value值是否是数字，如果是执行if
            if (!values.every(value => isNaN(value))) {
                sums[index] = values.reduce((prev, curr) => {
                //const value = Number(curr);
                //if (!isNaN(value)) {
                return prev+curr
                // } else {
                //   return prev;
                // }
                }, 0);
                let money=sums[index];
                sums[index]=money.toFixed(1)
               
            } else {
                
            }
            });

            return sums;
        },
        loadData(){
          /*  this.$post("cemetery/checkout/getCheckOutItemList",{c_id:this.c_id,sJzId:this.jz_id}).then(data=>{
                this.glJson=data;
            })*/
        }
    },
    watch:{
         data:{
            handler: function (newVal) {
                this.glJson=this.data.gl;
                this.gsJson=this.data.gs;
            },      
            deep: true    //深度监听
        }
    }
}
</script>
<style scoped>
.checkout_list{
    display:flex;
    flex-direction: column;
    width:100%;
    min-height:350px;
    overflow-x:hidden
}
.el-table{
    flex:1;
}
</style>